<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                xmlns:composite="http://java.sun.com/jsf/composite/composite"
                template="/WEB-INF/template.xhtml">

    <ui:define name="title">
        OutputLabel
    </ui:define>

    <ui:define name="description">
        OutputLabel is an extension to standard outputLabel component. Extended features are;
        <ul style="color: white;">
            <li>OutputLabel sets its value as the label of the target component
                    to be displayed in validation errors so that target component does not need to define label attribute again.</li>
            <li>Support for components with non-trivial markup like spinner, autocomplete, calendar
                and so on which are not supported by standard outputLabel.</li>
            <li>Theme aware error styling when associated component is not valid.</li>
            <li>Required field indicator.</li>
        </ul>
    </ui:define>

    <ui:param name="documentationLink" value="/components/outputlabel" />

    <ui:define name="implementation">

        <h:form>
            <p:panel id="panel" header="Form" style="margin-bottom:10px;">
                <p:messages id="messages" />
                <h:panelGrid columns="2" cellpadding="5">
                    <h:outputLabel for="name" value="Standard Label:" />
                    <p:inputText id="name" required="true" />

                    <p:outputLabel for="@next" value="Extended Label:" />
                    <p:inputText id="extended" required="true" />

                    <p:outputLabel for="@next" value="Number:" />
                    <p:spinner id="number" value="0"/>

                    <!-- For testing, don't remove!
                    <p:outputLabel for="@next" value="Label which considers @NotNull:" />
                    <p:inputText id="nullable" value="#{outputLabelView.nullableValue}" />

                    <p:outputLabel for="@next" value="Label which considers @NotNull:" />
                    <p:inputText id="notNull" value="#{outputLabelView.value}" />

                    <p:outputLabel for="@next" value="Label for input wrapped in composite:" />
                    <composite:inputTextWrapper id="nullableInComposite" value="#{outputLabelView.nullableValue}" required="true" />

                    <p:outputLabel for="@next" value="Label for input wrapped in composite, considering @NotNull:" />
                    <composite:inputTextWrapper id="notNullInComposite" value="#{outputLabelView.value}" />

                    <p:outputLabel for="@next" value="Label for input wrapped wrapped in composite:" />
                    <composite:inputTextWrapper id="nullableInCompositeComposite" value="#{outputLabelView.nullableValue}" required="true" />

                    <p:outputLabel for="@next" value="Label for input wrapped wrapped in composite, considering @NotNull:" />
                    <composite:inputTextWrapper id="notNullInCompositeComposite" value="#{outputLabelView.value}" />
                    -->
                </h:panelGrid>
            </p:panel>

            <p:commandButton value="Submit" update="panel"  />
        </h:form>

    </ui:define>

</ui:composition>